<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
    <title>Document</title>



    <!-- head 中 -->
    <link rel="stylesheet" href="file:///android_asset/weui/weui.min.css">
    <link rel="stylesheet" href="file:///android_asset/weui/jquery-weui.mini.css">
    <!-- body 最后 -->
    <script src="file:///android_asset/weui/jquery.min.js"></script>
    <script src="file:///android_asset/weui/jquery-weui.min.js"></script>

</head>

<body>
<div id="date" class="weui-cell">在这里显示时间</div>
<div id="dayEntry_table"></div>
<script>
        //第一步要获得所有数据
        //先获取所有要显示的记录项
        let JsonRecordEntryList = window.androidObject.getAndroidRecordEntryList();
        let recordEntryList = JSON.parse(JsonRecordEntryList);
        //然后获得日期
        let date = window.androidObject.getAndroidDate();


        //第二部准备好给separate_js准备的函数
        window.getFormat = function (template_id) {
            for (i in recordEntryList) {
                let recordEntry = recordEntryList[i];
                if (recordEntry.template_id === template_id) {
                    return recordEntry.format;
                }
            }
        };

        //第三步加载数据到dom元素中
        let div_dayEntry_table = document.getElementById("dayEntry_table");
        for (i in recordEntryList) {
            let recordEntry = recordEntryList[i];

            //放数据的整个格子
            let div_cell = document.createElement("div");


            //记录项名称的地方
            let div_name = document.createElement("div");
            div_name.setAttribute("class", "weui-cells__title");
            div_name.innerHTML = `<h2>` + recordEntry.name + `</h2>`;


            //放记录项数据的地方
            let div_value = document.createElement("div");
            //div_value.setAttribute("template_id",recordEntry.template_id);
            //div_value.setAttribute("class", "separateJS" + recordEntry.template_id);
            div_value.classList.add("separateJS" + recordEntry.template_id);
            let record_value = window.androidObject.getAndroidRecordValue_byId(recordEntry.id);
            div_value.setAttribute("value", record_value);
            //div_value.innerText="separateJS"+recordEntry.template_id;;
            div_value.innerHTML = "记录值JSON:" + record_value + "=======格式JSON" + getFormat(recordEntry.template_id);

            //绑定事件,单击数据div,调用安卓的recordView的dialog进行编辑
            div_value.onclick = function () {
                window.androidObject.callAndroidRecordView(recordEntry.id);
            };

            //加入到父元素中
            div_dayEntry_table.appendChild(div_cell);
            div_cell.appendChild(div_name);
            div_cell.appendChild(div_value);
        }

        //第四步修改时间显示
        let div_date = document.getElementById("date");
        let long_date = window.androidObject.getAndroidDate();
        let dateObj = new Date(long_date);
        let month = dateObj.getMonth() + 1;
        let day = dateObj.getDate();
        let shown_str = month + "." + day;
        let weekday = dateObj.getDay();
        let arrweekday = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
        div_date.innerHTML =
            `<div class="weui-cell__hd">
                <p>`+ dateObj.getFullYear() + `</p>
            </div>
            <div class="weui-cell__bd">
            <p style="text-align: center;font-size: 2rem;">`+ shown_str + `</p>
            </div>
            <div class="weui-cell__ft">
                <p>`+ arrweekday[weekday] + `</p>
            </div>`;





    </script>
</body>

</html>